<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="common/include :: header('订单明细')"/>
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <div class="col-sm-12" style="margin-top: 15px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">订单编号：</label>
                        <label class="col-sm-6 control-label">[[${order.orderSn}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">用户名：</label>
                        <label class="col-sm-6 control-label">[[${order.username}]]</label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">收货人：</label>
                        <label class="col-sm-6 control-label">[[${order.consigneeName}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">预留电话：</label>
                        <label class="col-sm-6 control-label">[[${order.mobile}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">收货地址：</label>
                        <label class="col-sm-6 control-label">[[${order.fullAddress}]]</label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">订单类型：</label>
                        <label class="col-sm-6 control-label">[[${@dict.getLabel('business_order_type',order.type)}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">订单状态：</label>
                        <label class="col-sm-6 control-label">[[${@dict.getLabel('business_order_state',order.orderState)}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">支付状态：</label>
                        <label class="col-sm-6 control-label">[[${@dict.getLabel('business_order_pay_state',order.payState)}]]</label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">自取时间：</label>
                        <label class="col-sm-6 control-label"
                               th:text="${order.takesTime} ? ${#dates.format(order.takesTime, 'yyyy-MM-dd HH:mm')} : '-'"></label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">下单时间：</label>
                        <label class="col-sm-6 control-label"
                               th:text="${order.orderTime} ? ${#dates.format(order.orderTime, 'yyyy-MM-dd HH:mm')} : '-'"></label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">支付时间：</label>
                        <label class="col-sm-6 control-label"
                               th:text="${order.payTime} ? ${#dates.format(order.payTime, 'yyyy-MM-dd HH:mm')} : '-'"></label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">收货时间：</label>
                        <label class="col-sm-6 control-label"
                               th:text="${order.receivingTime} ? ${#dates.format(order.receivingTime, 'yyyy-MM-dd HH:mm')} : '-'"></label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">退款时间：</label>
                        <label class="col-sm-6 control-label"
                               th:text="${order.refundTime} ? ${#dates.format(order.refundTime, 'yyyy-MM-dd HH:mm')} : '-'"></label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">商品总价：</label>
                        <label class="col-sm-6 control-label">[[${order.goodsPrice}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">打包费用：</label>
                        <label class="col-sm-6 control-label">[[${order.packPrice}]]</label>
                    </div>
                </div>
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">配送费用：</label>
                        <label class="col-sm-6 control-label">[[${order.freightPrice}]]</label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <div class="form-group">
                        <label class="col-sm-6 control-label">订单总价：</label>
                        <label class="col-sm-6 control-label">[[${order.orderPrice}]]</label>
                    </div>
                </div>
            </div>
            <div class="col-sm-12" style="margin: 5px">
                <div class="col-sm-4">
                    <label class="col-sm-6 control-label">备注信息：</label>
                    <label class="col-sm-6 control-label">[[${order.remark}]]</label>
                </div>
            </div>
        </div>
        <div class="btn-group-sm" id="item-toolbar" role="group">
            <a class="btn btn-success">
                <i class="fa fa-print"></i> 打印
            </a>
            <a id="exportBtn" class="btn btn-warning" onclick="exportOrderDetail()"
               shiro:hasPermission="business:orderGoods:export">
                <i class="fa fa-folder-open"></i> 导出
            </a>
        </div>
        <div class="col-sm-12 select-table table-striped">
            <table id="item-table"></table>
        </div>
    </div>
</div>
<th:block th:include="common/include :: footer"/>
<th:block th:include="common/include :: layout-latest"/>
<script th:inline="javascript">
    var orderId = [[${order.id}]];
    let prefix = ctx + "/business/orderGoods";
    $(function() {
        initOrderGoods();
    });
    function initOrderGoods(){
        var options = {
            id:"item-table",
            toolbar:'item-toolbar',
            url: prefix + "/queryByOrderId?orderId=" + orderId,
            modalName: "订单明细",
            showSearch:false,
            pagination:true,
            showRefresh:true,
            uniqueId:'id',
            columns: [
                {
                    field: 'goodsName',
                    title: '名称'
                },
                {
                    field: 'goodsPrice',
                    title: '价格'
                },
                {
                    field: 'number',
                    title: '数量'
                }]
        };
        $.table.init(options);
    }
    function exportOrderDetail() {
        window.open(prefix + "/exportOrderDetail?id=" + orderId);
    }



</script>
</body>
</html>